<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>档案</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" type="text/css" href="layui/css/layui.css">
	<link rel="stylesheet" type="text/css" href="css/index.css">
	<style type="text/css"></style>
	<script type="text/javascript" src="layui/layui.js"></script>
	<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
	<div class="main">
		<div class="layui-fluid">
			<div class="layui-row top">
				<div class="layui-col-sm1">
					&nbsp;
				</div>
				<div class="layui-col-sm10 layui-row">
					<img src="images/in-logo.jpg" alt="" class="layui-col-sm1 logo-top">&nbsp;
					<div class="layui-col-sm1 logo-font">&nbsp;领英</div>
					<div class="layui-col-sm3 search-box">
      					&nbsp;&nbsp;<i class="layui-icon" style="font-size: 20px; color: rgb(40,62,74);text-align:center;">&#xe615;</i> 
      					<input type="text" value="搜索" id="search" />
      					<script type="text/javascript">
      					$('#search').focus(function(){
      						$(this).val("");
      					});
      					$('#search').blur(function(){
      						$(this).val("搜索");
      					});
      					</script>
    				</div>
    				<div class="layui-col-sm6 layui-col-md-offset1">
    					<div style="line-height:normal;margin-top:15px;">
	    					<div class="layui-col-sm1 title-index">
	    						<i class="layui-icon" style="font-size: 30px; color: rgb(225,233,238);">&#xe68e;
	    						</i>
	    						<div style="color:rgb(225,233,238)">主页</div>
	    					</div>
    					</div>
    					<div style="line-height:normal;margin-top:15px;">
	    					<div class="layui-col-sm1 title-index">
	    						<i class="layui-icon" style="font-size: 30px; color: rgb(225,233,238);">&#xe613;
	    						</i>
	    						<div style="color:rgb(225,233,238)">人脉</div>
	    					</div>
    					</div>
    					<div style="line-height:normal;margin-top:15px;">
	    					<div class="layui-col-sm1 title-index">
	    						<i class="layui-icon" style="font-size: 30px; color: rgb(225,233,238);">&#xe632;
	    						</i>
	    						<div style="color:rgb(225,233,238)">职位</div>
	    					</div>
    					</div>
    					<div style="line-height:normal;margin-top:15px;">
	    					<div class="layui-col-sm1 title-index">
	    						<i class="layui-icon" style="font-size: 30px; color: rgb(225,233,238);">&#xe63a;
	    						</i>
	    						<div style="color:rgb(225,233,238)">消息</div>
	    					</div>
    					</div>
    					<div style="line-height:normal;margin-top:15px;">
	    					<div class="layui-col-sm1 title-index">
	    						<i class="layui-icon" style="font-size: 30px; color: rgb(225,233,238);">&#xe645;
	    						</i>
	    						<div style="color:rgb(225,233,238)">通知</div>
	    					</div>
    					</div>
    					<div style="line-height:normal;margin-top:15px;">
	    					<div class="layui-col-sm1 title-index">
	    						<i class="layui-icon" style="font-size: 30px; color: rgb(225,233,238);">&#xe612;
	    						</i>
	    						<div style="color:rgb(225,233,238)">我&nbsp;<i class="layui-icon" style="font-size: 10px; color: rgb(225,233,238);">&#xe625;
	    						</i></div>
	    					</div>
    					</div>
    					<div class="col-line"></div>
    					
    					<div style="line-height:normal;margin-top:15px;" class="layui-col-sm2;layui-row">
	    					
	    					<div class="title-index layui-col-sm1" style="float:left">
	    						<i class="layui-icon" style="font-size: 30px; color: rgb(225,233,238);">&#xe62d;
	    						</i>
	    						<div style="color:rgb(225,233,238)">更多<i class="layui-icon" style="font-size: 10px; color: rgb(225,233,238);">&#xe625;
	    						</i></div>
	    					</div>

	    					<div class="layui-col-sm1" style="float:left;margin-left:2%;cursor:pointer;text-align:center;">
	    						
	    						<div style="color:rgb(225,233,238);color:rgb(220,206,164)">账号<br/>升级</div>
	    					</div>
    					</div>
    					
    					
    					
    				</div>
				</div>
				<div class="layui-col-sm1">
					&nbsp;
				</div>
			</div>

		
		</div>
		<div style="width:100%;height:50px;"></div>
		<div class="content">
			<div class="content-left">
				<div class="user-data">
					<div class="user-img"></div>
					<div class="user-circle"></div>
					<div class="user-icon"><i class="layui-icon" style="font-size: 40px; color: #4c4c4c">&#xe65f;</i>&nbsp;&nbsp;<i class="layui-icon" style="font-size: 40px; color: #0084BF">&#xe642;</i></div>
					<div class="user-datas"><span style="color:#262626">Neelie Lee<br/>VC800</span><br/><span style="color:#4C4C4C;font-size:25px;">VC800<br/>中国·33</span><i class="layui-icon" style="font-size: 25px; color: #4c4c4c;cursor:default">&#xe613;</i>
	    			</div>
					<div class="point">
					</div>
					<script type="text/javascript">
						var total = $(window).width();
						var left_circle_1 = Number(total)/10;
						var left_circle_2 = ((Number(total)*8/10)*7/10)/2+left_circle_1-110;
						var left_str = left_circle_2+'px';
						$('.user-circle').css('left',left_str);
					</script>
				</div>
				<div class="level">
					<div class="level-font layui-row">
						<div class="layui-col-sm6 level-font-1">职业档案竞争力:<span style="color:black;font-weight:500">中级</span></div>
						<div class="layui-col-sm6 level-font-2"><i class="layui-icon" style="font-size: 30px; color: #4c4c4c;">&#xe61a;</i></div>
					</div>
					<div class="level-level">
							<div class="ex-level">
								<div class="each-level" style="border:none">
								</div>
								<div class="each-level"></div>
								<div class="each-level"></div>
								<div class="each-level"></div>
								<div class="each-level"></div>
								<div class="each-level"></div>
								<div class="each-level"></div>
							</div>
							<script type="text/javascript">
							var sum_num =4;
							$('.each-level').each(function(num){
								if(num>=sum_num)$(this).css('background','#E1E9EE');
							});
							</script>
					</div>
				</div>
				<div class="provate">
					<div class="pro-title"><p class="p1">管理界面</p><p class="p2">私密内容</p></div>
					<div class="pro-detail layui-row layui-col-space1">
						<div class="layui-col-sm4">13<br/><span class="pro-data">档案浏览</span></div>
						<div class="layui-col-sm4">0<br/><span class="pro-data">动态浏览</span></div>
						<div class="layui-col-sm4" style="border-right:1px solid #ccc">1<br/><span class="pro-data">搜索显示</span></div>
					</div>
				</div>
				<div class="edu">
					<div class="edu-title layui-row">
						<div class="layui-col-sm6">教育经历</div>
						<div class="layui-col-sm6 edu-add"><i class="layui-icon" style="font-size: 30px; color: #0084BF;">&#xe654;</i></div>
					</div>
					<div class="edu-vc layui-row">
						<div class="layui-col-sm6 edu-data layui-row"><div class="layui-col-sm4"><img src="images/edu.png" alt=""></div><div class="layui-col-sm8 edu-mes"><span style='font-weight:bold'>VC800</span><br/>2014年 - 2017年</div></div>
						<div class="layui-col-sm6"><div class="edu-editor"><i class="layui-icon" style="font-size: 30px; color: #0084BF;">&#xe642;</i></div></div>
					</div>
				</div>
				<div class="edu">
					<p class="edu-title">关注</p>
					<div class="edu-vc ">
						<div class=" edu-data layui-row"><div class="layui-col-sm2"><img src="images/edu.png" style="width:90%" alt=""></div><div class="layui-col-sm0 edu-mes"><span style='font-weight:bold'>Massachusetts Institute of Techn...</span><br/><span style='color:#747474'>352,864位关注者</span></div></div>
					</div>
				</div>
			</div>
			<div class="content-right">
				<div class="right-btns right-btn1 layui-row"><div class="layui-col-sm9">完善职业档案</div><div class="layui-col-sm3" style="text-align:right"><i class="layui-icon" style="font-size: 20px; color: white;">&#xe625;</i></div></div>
				<div class="right-btns layui-row"><div class="layui-col-sm9">编辑公开档案</div><div class="layui-col-sm3" style="text-align:right"><i class="layui-icon" style="font-size: 20px; color: #979797;">&#xe60b;</i></div></div>
				<div class="right-btns layui-row"><div class="layui-col-sm9">用其他语言创建职业档案</div><div class="layui-col-sm3" style="text-align:right"><i class="layui-icon" style="font-size: 20px; color: #979797;">&#xe60b;</i></div></div>
				<div class="edu">
					<div class="right-logo"><img src="images/in-logo.jpg" alt=""><!-- <i class="layui-icon" style="font-size: 10px; color: #979797;">&#xe60e;</i> --></div>
				</div>
			</div>
		</div>
	</div>
</body>
</html>